{% extends "my/layout.html" %}

{% block my %}
<div class="container">
    <div class="container">
        <h3>充值</h3>
        <hr>

        <p>您当前余额是 {{g.user.balance/100.0}} 元。</p>

        <h4>在线充值(支付宝充值)</h4>
        <p>请输入您想要充值的金额后,点击"开始充值"</p>

        <form action="" class="form-inline" method="post" id="recharge">
            <input type="hidden" name="pay_method" value="0">
            <div class="form-group">
                <label for="amount">金额(元): </label>
                <input type="text" placeholder="输入您要充值的金额" name="amount" id="amount" class="form-control">
                <span id="tip" class="alert-danger"></span>
            </div>
            <button class="btn btn-success">开始充值</button>
        </form>

        {% if recharges %}
        <h4>充值记录</h4>

        <table class="table table-bordered table-striped">
            <thead>
            <tr>
                <th>充值号</th>
                <th>金额(元)</th>
                <th>下单时间</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            {% for recharge in recharges %}
            <tr>
                <td>{{recharge.order_num}}</td>
                <td>{{recharge.amount/100.0}}</td>
                <td>{{recharge.gmt_created}}</td>
                <td>{{recharge.display_status}}</td>
                <td>
                    {% if recharge.status == 0 %}
                    <a href="javascript:void(0);" class="btn btn-success btn-recharge"
                       data-value="{{recharge.order_num}}">支付</a>
                    <a href="javascript:void(0);" class="btn btn-danger btn-cancel" data-value="{{recharge.order_num}}">取消</a>
                    {% endif %}
                </td>
            </tr>
            </tbody>
            {% endfor %}
        </table>

        {% endif %}
    </div>
</div>

{% endblock %}

{% block script %}
<script type="text/javascript">
    $(function () {
        var isDigital = function (val) {
            var re = new RegExp(/\d+\.\d {1,2}|\d/);
            var found = val.match(re);
            return found !== null;
        }

        $("#recharge").on('submit', function (ev) {
            var amount = $("#amount").val();
            if (!isDigital(amount)) {
                $("#tip").html("<label for='amount'>请输入有效数字</label>");
                $("#tip").show();
                ev.preventDefault();
            }
        });

        $(".btn-recharge").on('click', function () {
            var $this = $(this);
            var orderNum = $this.attr('data-value');

            $.post('{{url_for("over.handlers.my.recharge.pay")}}', {orderNum: orderNum}).done(function(data){
                if (data.success) {
                    ss.dynamicFormPost('https://shenghuo.alipay.com/send/payment/fill.htm',
                        {memo: data.payNum, 'optEmail': 'ubunoon@sina.com', 'payAmount': recharge.amount});
                }
            })

            ss.dynamicFormPost();
        });

        $(".btn-cancel").on('click', function () {
            var $this = $(this);
            var orderNum = $this.attr('data-value');

            ss.dynamicFormPost('{{url_for("over.handlers.my.recharge.cancel")}}', {orderNum: orderNum});
        })

    })
</script>
{% endblock %}